<template>
  <div class="subPage" >
    <div class="successBox">
      <img src="/static/images/success.png">
      <div class="titTop"></div>
      <div class="top">武大人民(湖北省人民医院)</div>
      <div class="bom"><span class="tit">支付金额：</span><span class="redClolr">¥</span><span class="price">{{details.pay_value}}.00</span></div>
    </div>
    <div class="orderBox">
      <div><span class="orderLabel">付款方式：</span><span>医保支付</span></div>
      <!-- <div><span class="orderLabel">医保支付：</span><span>{{details.pay_time}}</span></div>
      <div><span class="orderLabel">付款方式：</span><span>{{details.dept_name}}</span></div>
      <div><span class="orderLabel">付款账户：</span><span>{{details.dept_name}}</span></div>
      <div><span class="orderLabel">订单信息：</span><span>{{details.dept_name}}</span></div>
      <div><span class="orderLabel">账户余额：</span><span>{{details.dept_name}}</span></div> -->
    </div>
    <div class="fotBtn" @click="toAppointmentDetails"> 
      <img src="/static/images/leftIcon.png">
      <span class="btnClass">去交流</span>
    </div>
  </div>
</template>

<script>
  let app = getApp()
  let store = app.store
//   import { mapState } from 'vuex'
//   import nim from '@/utils/nim'
  import storage from '@/utils/storage'
//   import Bus from '@/utils/bus.js'
//   const { $Toast, $Message } = require('../../../../../static/iview/base/index')
//   import visitingTips from '@/components/visitingTips.vue'
  export default {
    components: {
    //   visitingTips
    },
    data () {
      return {
        dataInfo:{},
        details: {},
      }
    },
    computed: {
    //   ...mapState([
    //     'messageList', 'unreadList', 'totleChat', 'allChat', 'doctorInfo', 'sessionsList'
    //   ])
    },
    mounted () {
     
    },
    // onUnload: function () {
    //   wx.redirectTo({
    //     url: '/pages/subPage/register/dept/main'
    //   })
    //   // this.$router.replace(`/pages/subPage/register/dept/main`)
    // },
    methods: {
      toAppointmentDetails () {
        this.$router.replace(`/pages/center/child/appointmentDetails/main?aptId=${this.dataInfo.apt_id}`)
      },
      getDetails() {
        this.$api.detail({apt_id: this.dataInfo.apt_id}, ({'showLoading': true})).then(res => {
          // console.log(res)
          this.details = res.data[0]
        })
      }
    },
    onShow () {
      // this.getWechatList()
       this.dataInfo = JSON.parse(this.$route.query.data)
      this.getDetails()
    },
    watch: {
      sessionsList: function(oldValue, newValue) {
        // this.dealData()
      }
    }
  }
</script>

<style scoped lang='less'>
  .subPage {
    display: flex;
    flex-direction: column;
    .successBox{
      padding-bottom: 59rpx;
      border-bottom: 1rpx solid #E9E9E9;
      // div{
      //   margin-top:20rpx;
      //   text-align: center;
      // }
      // span{
      //   display: inline-block;
      //   color: #333333;
      //   font-size:30rpx;
      // }
      .titTop{
        font-size:48rpx;
        // font-family:PingFangSC-Regular,PingFang SC;
        font-weight:400;
        color:rgba(255,84,83,1);
        margin-bottom: 14rpx;
      }
      .top{
        text-align: center;
        margin-top: 56rpx;
        margin-bottom: 21rpx;
        font-size:30rpx;
        // font-family:PingFangSC-Light,PingFang SC;
        font-weight:300;
        color:rgba(51,51,51,1);
      }
      .bom{
        text-align: center;
        .tit{
          font-size:30rpx;
          // font-family:PingFangSC-Light,PingFang SC;
          font-weight:300;
          color:rgba(51,51,51,1);
        }
      }
      img{
        width: 305rpx;
        height: 200rpx;
        // position: absolute;
        margin-left: 226rpx;
        margin-top: 120rpx;
      }
      .price{
        color: #FF5453;
      }
      .redClolr{
        color:#FF5453;
        font-size: 20rpx;
      }
    }
  }
  // .successBox>div:nth-child(2){
  //     font-size:48rpx;
  //     font-weight:400;
  //     color:rgba(255,84,83,1);
  //   }
  //   .successBox>div:nth-child(3){
  //     font-size:30rpx;
  //     font-weight:400;
  //     color:rgba(51,51,51,1);
  //   }
    .orderBox{
      margin-top: 56rpx;
      margin-bottom: 70rpx;
      padding-left: 40rpx;
      text-align: center;
      div{
        margin-bottom: 20rpx;
        // text-align: center;
      }
      span{
        display: inline-block;
        font-size:30rpx;
        font-weight:400;
        color:rgba(51,51,51,1);
        width: 50%;
        text-align: left;
      }
      .orderLabel{
        font-size:30rpx;
        font-weight:300;
        color:rgba(102,102,102,1);
        // margin-right: 10rpx;
        text-align: center;
        width: 50%;

      }
    }
    .fotBtn{
      text-align: center;
      img{
        width: 32rpx;
        height: 30rpx;
        margin-right: 20rpx;
        vertical-align: middle;
      }
      span{
        font-size:30rpx;
        font-weight:400;
        color:rgba(37,143,248,1);
        display: inline-block;
        vertical-align: middle;
      }
    }
    .btnBox{
        margin: 30rpx;
          font-size:36rpx;
          font-weight:400;
          color:rgba(255,255,255,1);
          text-align: center;
          height: 80rpx;
          line-height: 80rpx;
          background: #4253E1;
          border-radius: 10rpx;
        }
        .btnClass{
          font-size:30rpx;
          // font-family:PingFangSC-Regular,PingFang SC;
          font-weight:400;
          color:rgba(37,143,248,1)
        }
</style>
